<template>
	<view class="page">
		<view class="" style="flex: 1;">
			<!-- <up-navbar title="百霸智育" @rightClick="{}" :autoBack="true" bgColor = "#f1f1f1" placeholder></up-navbar> -->
			<!-- <up-navbar title="" @rightClick="{}" :autoBack="true" bgColor = "#fff" placeholder></up-navbar> -->
			<view class="flex column box-sizing width-full paddingTop-30 paddingBottom-30">
				<up-cell-group :customStyle = "{'background-color':'#fff'}">
					<up-cell @click="cellClick(0)" :value = "form.word_numName" title="每组记词量" isLink></up-cell>
					<up-cell @click="cellClick(1)" :value = "form.group_numName" title="每日记词组数" isLink ></up-cell>
					<!-- <up-cell @click="cellClick(2)" :value = "form.level_nowName" title="记词类型" isLink></up-cell> -->
				</up-cell-group>
				<!-- <view class="width-full height-20"></view>
				<up-cell-group :customStyle = "{'background-color':'#fff'}">
					<up-cell @click="cellClick(3)" :value = "form.yingbiaoName" title="音标" isLink></up-cell>
					<up-cell @click="cellClick(4)" :value = "form.yuyinName" title="语音" isLink></up-cell>
					<up-cell @click="cellClick(5)" :value = "form.cixingName" title="词性" isLink></up-cell>
				</up-cell-group> -->
				<view class="width-full height-20"></view>
				<up-cell-group :customStyle = "{'background-color':'#fff'}">
					<!-- <up-cell @click="cellClick(6)" :value = "form.moshiName" title="记词模式" isLink></up-cell> -->
					<up-cell @click="cellClick(7)" :value = "form.studymoshiName" title="学习模式" isLink></up-cell>
				</up-cell-group>
			</view>
			<up-picker closeOnClickOverlay keyName="label" :show="pickerShow" :columns="lists[defaultCell+'List']" @close="pickerShow = false" @cancel="pickerShow = false" @confirm="pickerChange" ></up-picker>
		</view>
		<view class="width-full box-sizing btns flex column items-center flex-center">
			<view  class="marginTop-30 flex flex-center" style = "width: 80vw;">
				<up-button @click="btnClick" size = "normal" type="success"  text="保存设置" iconColor="#51D580'"></up-button>
			</view>
		</view>
	</view>
</template>

<script setup>
	import { ref,inject } from 'vue';
	import { onReady } from '@dcloudio/uni-app'	
	const updateWordSet = inject('updateWordSet');
	console.log(updateWordSet,'assssssas')
	const form = ref({
		word_num:5,
		word_numName:'5个',
		group_num:5,
		group_numName:'5组',
		level_now:1,
		level_nowName:'陌生词',
		yingbiao:0,
		yingbiaoName:'隐藏',
		yuyin:0,
		yuyinName:'隐藏',
		cixing:0,
		cixingName:'隐藏',
		moshi:1,
		moshiName:'快记',
		studymoshi:1,
		studymoshiName:'中译英',
	})
	const defaultCell = ref('')
	const pickerShow = ref(false)
	const lists = ref({
		word_numList:[
			[
				{
					label:'5个',
					value:1
				},
				{
					label:'10个',
					value:2
				},
			]
		],
		group_numList:[
			[
				{
					label:'5组',
					value:1
				},
				{
					label:'10组',
					value:2
				},
			]
		],
		level_nowList:[
			[
				{
					label:'陌生词',
					value:1
				},
				{
					label:'熟悉词',
					value:2
				},
			]
		],
		yingbiaoList:[
			[
				{
					label:'隐藏',
					value:0
				},
				{
					label:'显示',
					value:1
				},
			]
		],
		yuyinList:[
			[
				{
					label:'隐藏',
					value:0
				},
				{
					label:'显示',
					value:1
				},
			]
		],
		cixingList:[
			[
				{
					label:'隐藏',
					value:0
				},
				{
					label:'显示',
					value:1
				},
			]
		],
		moshiList:[
			[
				{
					label:'快记',
					value:1
				},
				{
					label:'快记',
					value:2
				},
			]
		],
		studymoshiList:[
			[
				{
					label:'中译英',
					value:1
				},
				{
					label:'英译中',
					value:2
				},
				{
					label:'混合',
					value:3
				},
			]
		]
		
	})
	const cellClick = (id)=>{
		let datas = ['word_num','group_num','level_now','yingbiao','yuyin','cixing','moshi','studymoshi']
		defaultCell.value = datas[id]
		pickerShow.value = true
		
	}
	const pickerChange = (e)=>{
		console.log(e.value[0].label,22222222) 
		if(e.value&&e.value[0]){
			form.value[defaultCell.value] = e.value[0].value
			form.value[defaultCell.value+"Name"] = e.value[0].label
		}
		pickerShow.value = false
		
	}
	const updateWordSetFun = (param)=>{
		updateWordSet(param).then(res=>{
			console.log(res,666666)
			if(param.type == 'studymoshi'){
				setTimeout(()=>{
					uni.navigateBack();
				},200)
			}
		})
	}
	// 保存设置按钮
	const btnClick = ()=>{
		console.log(3333333333)
		
		
		for (let var1 in form.value) {
			// updateWordSetFun()
			let index = var1.indexOf('Name')
			if(index == -1){
				updateWordSetFun({type:var1,value:form.value[var1]})
			}
			console.log(var1,form.value[var1],'hhhhhhhhh')
		}
		// uni.navigateBack()
	}
	
</script>

<style lang="scss" scoped>
.page{
	flex: 1;
	background-color: #f1f1f1;
}
.btns{
	padding-bottom: calc(50rpx);
}
</style>
